<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link rel="icon" href="./odvis-web/static/favicon.ico">
    <title>HikCentral iVisual-UI Power</title>
    <link href="./odvis-web/static/css/chunk-33fc01fc.f5b17305.css" rel="prefetch">
    <link href="./odvis-web/static/css/chunk-46d09f80.4908a80a.css" rel="prefetch">
    <link href="./odvis-web/static/css/chunk-6aeb2eb9.a64edd04.css" rel="prefetch">
    <link href="./odvis-web/static/css/chunk-cf1760be.a38206b9.css" rel="prefetch">
    <link href="./odvis-web/static/js/chunk-2d0c264f.9d106f02.js" rel="prefetch">
    <link href="./odvis-web/static/js/chunk-2d0c7aa8.cf95b7d6.js" rel="prefetch">
    <link href="./odvis-web/static/js/chunk-33fc01fc.73532469.js" rel="prefetch">
    <link href="./odvis-web/static/js/chunk-46d09f80.d9e5bd36.js" rel="prefetch">
    <link href="./odvis-web/static/js/chunk-6aeb2eb9.202a79d0.js" rel="prefetch">
    <link href="./odvis-web/static/js/chunk-cf1760be.25073dea.js" rel="prefetch">
    <link href="./odvis-web/static/css/app.584e11b5.css" rel="preload" as="style">
    <link href="./odvis-web/static/css/chunk-vendors.adea34bb.css" rel="preload" as="style">
    <link href="./odvis-web/static/js/app.99d9ce68.js" rel="preload" as="script">
    <link href="./odvis-web/static/js/chunk-vendors.b713068b.js" rel="preload" as="script">
    <meta name="_csrf_header" content="${(_csrf.headerName)!}">
    <meta name="_csrf" content="${(_csrf.token)!}">
    <link href="./odvis-web/static/css/chunk-vendors.adea34bb.css" rel="stylesheet">
    <link href="./odvis-web/static/css/app.584e11b5.css" rel="stylesheet">
</head>
<body class="dolphin">
<noscript><strong>We're sorry but phildemo doesn't work properly without JavaScript enabled. Please enable it to
    continue.</strong></noscript>
<div id="app">
    <div class="block-loading">
        <div class="block1"></div>
        <div class="block2"></div>
        <div class="block3"></div>
        <div class="block4"></div>
    </div>
    <style>.block-loading {
        position: fixed;
        top: 50%;
        left: 50%;
        right: 0;
        bottom: 0;
        transform: translate(-50%, -50%);
        display: flex;
        width: 64px;
        height: 64px;
        justify-content: space-around;
        align-items: center;
        box-sizing: border-box;
        padding: 0 4px;
    }

    .block-loading > div {
        height: 55%;
        width: 18%;
        background: #d4d4d4;
        opacity: 0.3;
        transform: skewX(-7deg) scale(0.58) translateZ(0);
        animation: loading 1.5s infinite;
    }

    .block-loading > .block1 {
        transform-origin: 6% 50% 0;
        animation-delay: 0s;
    }

    .block-loading > .block2 {
        transform-origin: 36% 50% 0;
        animation-delay: 0.2s;
    }

    .block-loading > .block3 {
        transform-origin: 66% 50% 0;
        animation-delay: 0.4s;
    }

    .block-loading > .block4 {
        transform-origin: 96% 50% 0;
        animation-delay: 0.6s;
    }

    @keyframes loading {

        0%,
        100% {
            opacity: 0.3;
            transform: skewX(-7deg) scale(0.58);
        }

        20%,
        80% {
            opacity: 0.3;
            transform: skewX(-7deg) scale(0.58);
        }

        50% {
            opacity: 1;
            transform: skewX(-7deg) scale(1);
        }
    }</style>
</div>
<script src="./odvis-web/static/js/chunk-vendors.b713068b.js"></script>
<script src="./odvis-web/static/js/app.99d9ce68.js"></script>
</body>
</html>